<template>
	<view>
		<u-navbar :is-back="false" :background="background">
			<view class="slot-wrap">
				<view class="slot-left">
					<!-- <text class="slot-left-text" v-if="initData">{{initData.app_name}}</text> -->
					<text class="slot-left-text">{{appName}}</text>
					<!-- <u-icon name="arrow-down-fill" color="#ffffff" size="25"></u-icon> -->
				</view>
				<!-- <view class="search-wrap">
					<u-search v-model="keyword" :disabled="true" :show-action="false" :action-style="{color: '#fff'}">
					</u-search>
				</view> -->
			</view>
		</u-navbar>
		<!-- 	<view class="ym-search">
			<u-search placeholder="搜索一下" @click="$u.route('/pages/search/search')" disabled v-model="keyword"
				:show-action="false"></u-search>
		</view>
		 -->
		<view class="banner">
			<u-swiper :list="home_banner" keyName="image" showTitle :autoplay="false" circular height="300"></u-swiper>
		</view>
		<view class="gird">
			<u-grid :col="5" :border="false">
				<u-grid-item style="background: rgba(0,0,0,0);" @click="goToPage(item.id)"
					v-for="(item,index) in home_menu" :key="index">
					<u-image width="80rpx" height="80rpx" :src="item.icon"></u-image>
					<view class="grid-text">{{item.name}}</view>
				</u-grid-item>
			</u-grid>
		</view>
		<view class="ad">

			<u-image :border-radius="10" width="100%" height="200rpx" :src="home_banner2[0].image">
			</u-image>
		</view>
		<u-sticky :offset-top="offsetTop">
			<view style="background-color: #F8F8F8;">
				<!-- 标题栏 -->
				<HeadCell :leftShow="false" :tabs="home_menu" :rightShow="false" @tabChange="tabChange">
				</HeadCell>
			</view>
		</u-sticky>
		<block>
			<view class="info-margin">
				<!-- 招聘信息列表 -->
				<AllList :JobData="JobData"></AllList>
				<view style="background-color: white;" v-if="JobData.length==0">
					<u-empty text="暂无数据" mode="list"></u-empty>

				</view>
			</view>
		</block>
		<!-- #ifdef H5 -->
		<view style="height: 44px"></view>
		<!-- #endif -->
	</view>
</template>

<script>
	import {
		APP_NAME
	} from '../../env.js'
	import AllList from '@/components/allList/allList.vue'
	export default {
		components: {
			AllList
		},
		data() {
			return {
				search: {
					pageSize: 10,
					page: 1,
				},
				home_menu: [],
				home_banner: [],
				home_banner2: [],
				appName: APP_NAME,
				background: {
					backgroundColor: '#f44c01',
				},
				keyword: '',
				offsetTop: 0,
				JobData: [],
				houseRentData: [],
				houseSellData: [],
				tabs: [{
					name: '好工作'
				}, {
					name: '好房出租'
				}, {
					name: '好房出售'
				}, {
					name: '品质好车'
				}, {
					name: '生意转让'
				}, {
					name: '本地推广'
				}, {
					name: '打听'
				}, {
					name: '人才'
				}],
				tabs1: [{
					name: '好房出租'
				}, {
					name: '好房出售'
				}, {
					name: '品质好车'
				}, {
					name: '生意转让'
				}, {
					name: '本地推广'
				}, {
					name: '打听'
				}, {
					name: '人才'
				}],
				carData: [],
				transferData: [],
				promoteData: [],
				askData: [],
				resumeData: [],
				tabCurrent: 0,
				initData: null,
				opentop: false,
			}
		},
		onLoad() {
		
		},
		onShareAppMessage() {
			return {
				title: APP_NAME,
				path: '/pages/index/index'
			}
		},
		onShow(options) {
		var that = this;
		//#ifndef H5
		uni.getSystemInfo({
			success: function(res) {
				let windowWidth = res.windowWidth;
				let statusBarHeight = res.statusBarHeight ? res.statusBarHeight : 0;
				that.offsetTop = (44 + statusBarHeight) * 750 / windowWidth;
			}
		});
		//#endif
		this.$u.get('/api/article/cate', {
		
		}).then(res => {
			this.home_menu = res;
			this.queryList(res[0].id)
			uni.setStorageSync('initData', res);
		})
		this.$u.get('/api/ad/lists', {
			cate_id: 1
		}).then(res => {
			this.initData = {};
			this.home_banner = res;
			uni.setStorageSync('initData', res);
		})
		this.$u.get('/api/ad/lists', {
			cate_id: 2
		}).then(res => {
			this.initData = {};
			this.home_banner2 = res;
			uni.setStorageSync('initData', res);
		})
		},
		methods: {
			queryList(cid) {
				//这里的pageNo和pageSize会自动计算好，直接传给服务器即可
				//通过this.$refs.paging.complete(请求回来的数组);将请求结果传给z-paging
				this.search.cid = cid
				this.$u.get('/api/article/lists', this.search).then(res => {
					this.JobData = res.lists
				}).catch(err => {})
			},
			goToPage(id) {
				// 假设我们要传递的参数是jobId
				// 使用uni.navigateTo进行页面跳转，并通过URL的query部分传递jobId
				uni.navigateTo({
					url: `/pagesIndex/index/index?cid=${id}`
				});

			},
			getVerify() {
				this.$u.get('/addons/hicity/index/getVerify', {}).then(res => {
					this.opentop = res.opentop;
					if (this.opentop) {
						this.getJobList()
					} else {
						this.getHouseRentList();
					}
				})
			},
			tabChange(index) {
				this.queryList(this.home_menu[index].id)
			},
			getJobList() {
				this.$u.get('/addons/hicity/job/list', {

				}).then(res => {
					this.JobData = res;
				})
			},
			getHouseRentList() {
				this.$u.get('/addons/hicity/house/list', {
					info_type: 'rent',
				}).then(res => {
					this.houseRentData = res;
				})
			},
			getHouseSellList() {
				this.$u.get('/addons/hicity/house/list', {
					info_type: 'sell',
				}).then(res => {
					this.houseSellData = res;
				})
			},
			getCarList() {
				this.$u.get('/addons/hicity/car/list', {}).then(res => {
					this.carData = res;
				})
			},
			getTransferList() {
				this.$u.get('/addons/hicity/transfer/list', {}).then(res => {
					this.transferData = res;
				})
			},
			getPromoteList() {
				this.$u.get('/addons/hicity/promote/list', {}).then(res => {
					this.promoteData = res;
				})
			},
			getAskList() {
				this.$u.get('/addons/hicity/ask/list', {}).then(res => {
					this.askData = res;
				})
			},
			getResumeList() {
				this.$u.get('/addons/hicity/resume/list', {}).then(res => {
					this.resumeData = res;
				})
			}
		}
	}
</script>
<style lang="scss" scoped>
	.ym-search {
		padding: 20rpx;
		background-color: white;
		position: fixed;
		left: 0;
		right: 0;
		z-index: 1000;
	}

	.slot-wrap {
		display: flex;
		flex-direction: row;
		align-items: center;
		width: 750rpx;
		//加入搜索框时去掉
		justify-content: center;
	}

	.slot-left {
		display: flex;
		flex-direction: row;
		align-items: center;
		margin: 0 20rpx;
		/* #ifdef MP */
		margin-bottom: 10rpx;

		/*  #endif  */
		.slot-left-text {
			font-size: 35rpx;
			color: white;
			margin-right: 10rpx;
		}
	}

	.search-wrap {
		margin: 0 20rpx;
		/*  #ifndef MP */
		flex: 1;
		/*  #endif  */
		/* #ifdef MP */
		width: 380rpx;
		margin-bottom: 10rpx;
		/*  #endif  */
	}

	.banner {
		margin: 20rpx;
	}

	.gird {
		margin: 0 20rpx;
		background-color: white;
		border-radius: 20rpx;
	}

	.ad {
		margin: 20rpx;
	}

	.info-margin {
		margin: 0 20rpx 20rpx 20rpx;
	}

	.resumeList {
		display: flex;
		flex-direction: column;
		background-color: white;
		padding: 20rpx;
		margin-bottom: 20rpx;

		.user {
			display: flex;
			flex-direction: row;
			align-items: center;
			flex: 1;

			.uinfo {
				display: flex;
				flex-direction: column;
				line-height: 60rpx;
				margin-left: 20rpx;

				.name {
					font-size: 32rpx;
					color: #333333;
					font-weight: 600;
				}

				.age {
					font-size: 30rpx;
					color: #666666;
				}
			}
		}

		.bot {
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: space-between;
			padding: 20rpx 0;
			color: #666666;

			.text {
				color: #40c6bf;
			}
		}
	}
</style>
<style>
	.u-grid-item {
		background-color: rgba(0, 0, 0, 0) !important;
	}
</style>